<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar
      :is-white="false"
      :title="navTitle"
      :custom-back="goBack"
      style="z-index: 99999"
    >
      <view class="nav-right-icon">
        <u-icon v-if="isAddAuth" name="plus" color="#FFF" @tap="handleAddClick"></u-icon>
      </view>
    </theme-navbar>
    <!-- #endif -->
    <!-- #ifdef H5-WECHAT || H5-EMP -->
    <fab-button v-if="isAddAuth" :content="fContent" @fabtrigger="fabtrigger" />
    <!-- #endif -->
     <view class="content u-page">
      <u-tabs
        :list="tabList"
        :is-scroll="false"
        :current="tabCurrent"
        @change="headerTabsChange"
      ></u-tabs>
      <me-table
        :i="0"
        :index="0"
        :height="getListViewHeight()"
        :load-data="loadData"
        :init-load="false"
        ref="mescrollItem0"
      >
        <template #default="d">
          <u-swipe-action
            :index="d.index"
            :show="d.data.show"
            :options="getSwipeOptions(d.data)"
            @click="handleActionClick"
            @open="handleSwipeOpen(d.index)"
          >
        
            <list-card :data="d.data" @click="handleCardClick" />
          </u-swipe-action>
        </template>
      </me-table>
      <!-- </mescroll-list> -->
    </view>

    <u-tabbar
      :list="tabbarList"
      :height="100"
      :active-color="$theme.u_type_primary"
      icon-size="40"
      bg-color="#fff"
      :mid-button="false"
      v-model="tabbarCurrent"
      @change="handleTabbarChange"
    ></u-tabbar>
  </view>
</template>

<script>
import meTable from "@/components/me-table.vue";
import listCard from "./components/list-card.vue";
import MescrollMoreMixin from "@/components/mescroll-uni/mixins/mescroll-more.js";
import threeTeamworkService from "@/service/threeTeamwork/three.teamwork.service.js";
import { dateUtils } from "@/common/util";
import fabButton from "@/components/uni-fab.vue";

const allStatus = {
  "00": { text: "草稿" },
  "01": { text: "待提报" },
  "02": { text: "待分派" },
  "03": { text: "待处理" },
  "04": { text: "处理中" },
  "05": { text: "待审核" },
  "06": { text: "已完成" },
  "07": { text: "已归档" },
  "08": { text: "作废" },
};

export default {
  components: {
    meTable,
    listCard,
    fabButton,
  },
  mixins: [MescrollMoreMixin],
  data() {
    return {
      userInfo: this.$store.state.userInfo,
      tabbarCurrent: 1,
      tabbarList: [
        {
          iconPath: "home",
          selectedIconPath: "home-fill",
          text: "全部",
          count: 0,
          isDot: false,
          customIcon: false,
        },
        {
          iconPath: "home",
          selectedIconPath: "home-fill",
          text: "发给我",
          count: 0,
          isDot: false,
          customIcon: false,
        },
        {
          iconPath: "edit-pen",
          selectedIconPath: "edit-pen-fill",
          text: "我发起的",
          count: 0, // 总数
          isDot: false,
          customIcon: false,
        },
      ],
      defaultTabList: [{ name: "待处理" }, { name: "已处理" }, { name: "已归档" }],
      tabList: [],
      tabCurrent: 0,
      fContent: [
        {
          iconPath: require("@/static/add.png"),
          selectedIconPath: require("@/static/add.png"),
          text: "创建协同",
          active: false,
        },
      ],
    };
  },
  computed: {
    showTabbar() {
      let roleCodes = this.userInfo.roles.map((item) => item.roleCode);

      return roleCodes;
    },
    // 是否具有创建协同的权限
    isAddAuth() {
      let flag = false;
      let userRoles = this.userInfo.roles.map((item) => item.roleCode);
      // 授权角色，市管员、送货员、客户经理
      let authRoles = ["s_scgly_x", "s_shy_x", "s_khjl_x"];

      for (let i=0; i<userRoles.length; i++) {
        for (let j=0; j<authRoles.length; j++) {
          if (i === j) {
            flag = true;
            break;
          }
        }
      }

      return flag;
    },
  },
  onLoad() {
    this.tabList = this.defaultTabList;
  },
  methods: {
    updateBackState(param) {
      if (param.submitSuccess) {
        this.$refs.mescrollItem0.refresh();
      }
    },
    getListViewHeight() {
      let p = (this.$u.sys().windowHeight - 44 - 48 - uni.upx2px(90) - this.$u.sys().statusBarHeight) + "px";
      // #ifdef H5-DINGDING || H5-WECHAT
      p = (this.$u.sys().windowHeight - 48 - uni.upx2px(90) - this.$u.sys().statusBarHeight) + "px";
      // #endif
      
      return p;
    },
    fabtrigger(btn) {
      if (btn.index === 0) {
        this.handleAddClick();
      }
    },
    handleAddClick() {
      this.$u.route({
        url: "/pages/threeMembersTeamWork/teamworkCreate",
      });
    },
    handleCardClick(data) {
      let toUrl;
      switch (data.taskStatus) {
        case "00": case "01":
          toUrl = "/pages/threeMembersTeamWork/teamworkCreate";
          break;
        case "02": case "03": case "04": case "05": case "06": case "07":
          toUrl = "/pages/threeMembersTeamWork/teamworkHandle";
          break;
        default:
          break;
      }

      this.$u.route({
        url: toUrl,
        params: {
          taskUuid: data.taskUuid
        },
      });
    },
    // 切换tabs刷新列表
    handleTabbarChange(curr) {
      this.tabbarCurrent = curr;
      this.$refs.mescrollItem0.refresh();
    },
    headerTabsChange(curr) {
      this.tabCurrent = curr;
      this.$refs.mescrollItem0.refresh();
    },
    getSwipeOptions(data) {
      let text = data.taskStatus == "00" ? "删除" : "作废";
      if (data.taskStatus == "00") {
        return [{
          text,
          style: {
            backgroundColor: "#dd524d",
          },
        }]
      } else {
        return;
      }
    },
    handleSwipeOpen(index) {
      // 排他 当前的打开，其他关闭
      let list = this.$refs.mescrollItem0.listDatas;
      list[index].show = true;
      list.map((val, idx) => {
        if (index != idx) list[idx].show = false;
      });
    },
    handleActionClick(index, index1) {
      let list = this.$refs.mescrollItem0.listDatas;
      let data = list[index];
      this.deleteData(data);
    },
    deleteData(data) {
      let paras = { taskUuid: data.taskUuid };
      threeTeamworkService.deleteMSCoordinationTask(paras).then(res => {
        if (res.success) {
          this.$u.toast("删除成功!");
          this.$refs.mescrollItem0.refresh();
        }
      })
    },
    loadData(page) {
      let taskStatus = "0" + (this.tabCurrent + 1); // 01(待处理)、 02(已处理)、 03(已归档)
      let buttonType = "0" + (this.tabbarCurrent + 1); // 01(全部)、 02(发给我的)、 03(我发起的)
      let parmas = {
        page: page.num,
        limit: page.size,
        paras: {
          taskStatus,
          buttonType,
        },
      };
      return new Promise((resolve, reject) => {
        threeTeamworkService.selectMSCoordinationTask(parmas).then((res) => {
          if (res.success) {
            resolve({
              count: res.totalRow,
              data: res.data,
            });

            this.tabList = this.tabList.map((item, idx) => {
              if (idx === this.tabCurrent) {
                item.count = res.totalRow;
              } else {
                item.count = 0;
              }
              return item;
            });
          } else {
            reject(res);
            this.$u.toast(res.msg);
          }
        });
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.page {
  padding: 0;
}

.content {
  background-color: #f3f4f5;
}

.sticky-header {
  position: fixed;
  /* #ifndef H5-ONLY  */
  top: 0px;
  /* #endif */
  /* #ifdef H5-ONLY  */
  top: 45px;
  /* #endif */
  width: 100%;
  z-index: 999;
}

</style>
